<!-- 处理开给渠道的销项票-->
<template>
  <el-dialog :visible.sync="dialogVisible" title="销项票管理" width="1200px" :append-to-body="false"
    :close-on-click-modal="false" v-drag2anywhere>
    <el-form label-width="100px">
      <el-row>
        <el-col :span="6">
          <el-form-item label="下单时间:">{{detail.orderdate}}</el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="外部单号:">{{detail.ordercode}}</el-form-item>
        </el-col>

        <el-col :span="6">
          <el-form-item label="订单渠道:">{{detail.platform}}</el-form-item>
        </el-col>


      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="客户单位:">{{detail.clientname}}</el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="订单总额:">{{format2Number(detail.sum_order,3)}}</el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="开票金额:">{{format2Number(detail.sum_platform,3)}}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="合作商:">{{detail.supname}}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="所属账套:">{{detail.account}}</el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col>
          <el-form-item label="销售明细:">
            <div style="height: 200px; border: 1px solid #eaeaea; overflow-y: auto;">
              <el-table :data="detail.goods" border style="height: 100%;">
                <el-table-column type="index" label="序号" width="60px" align="center"></el-table-column>
                <el-table-column prop="title" label="商品名称"></el-table-column>
                <el-table-column prop="model" label="规格型号" width="100px"></el-table-column>
                <el-table-column prop="unit" label="单位" width="100px" align="center"></el-table-column>
                <el-table-column prop="count" label="数量" width="100px" align="center"></el-table-column>
                <el-table-column prop="price" label="单价" width="120px" align="center"></el-table-column>
                <el-table-column prop="total" label="小计" width="120px" align="center"></el-table-column>
                <el-table-column prop="account" label="所属账套" align="center"></el-table-column>
              </el-table>
            </div>
            <div style="text-align: right;">
              <span style="margin-right:20px;">订单总额:{{parseFloat(detail.sum_order+"").toFixed(2)}}</span>
              <span style="margin-right:20px;">折后总额:{{parseFloat(detail.sum_platform+"").toFixed(2)}}</span>
            </div>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="16" style="padding: 0px 0px 20px 0px;">
          <el-form-item label="发票号码:">
            <div style="text-align: right; margin:0px 0px 5px;">
              <el-button @click="handleAddTicket" type="primary" icon="el-icon-plus">添加发票</el-button>
            </div>
            <div style="border: 1px solid #E3E3E3; overflow-y: auto; height:200px">
               <table border="0" cellspacing="0" style="width: 100%; " class="el-table">
                  <tr style="height: 20px;">
                    <td style="border:1px solid #E3E3E3;text-align: center; width: 80px;">序号</td>
                    <td style="border: 1px solid #E3E3E3;text-align: center;">发票号码或数电票号</td>
                    <td style="border: 1px solid #E3E3E3;text-align: center;">附件</td>
                    <td style="border: 1px solid #E3E3E3;text-align: center; width: 80px;"> 操作</td>
                  </tr>
                  <tr v-for="(item,index) in detail.platformticket_ids" style="height: 20px; padding: 0px;">
                    <td class="el-table__cell is-center" style="border: 1px solid #E3E3E3;padding: 0px; height: 20px;">{{index+1}}</td>
                    <td class="el-table__cell is-center" style="border: 1px solid #E3E3E3;padding: 0px; height: 20px;">{{item}}</td>
                     <td style="border: 1px solid #E3E3E3;text-align: center;padding: 0px; height: 20px;">/</td>
                    <td class="el-table__cell is-center"><el-button circle type="danger" icon="el-icon-delete" title="删除发票" @click="handleRemove(index,item)" ></el-button></td>
                  </tr>
               </table>
              </div>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-row :gutter="20">
            <el-col>
              <el-form-item label="销项状态:">
                <el-select v-model="detail.platformticket_status">
                  <el-option label="待开" :value="0"></el-option>
                  <el-option label="已开具" :value="1"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="销项备注:">
                <el-input v-model="detail.platformticket_statusmemo" :rows="10" type="textarea" placeholder="销项发票状态备注信息"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </el-col>
      </el-row>
    </el-form>
    <AttachViewer v-if="attachVisible" ref="attachUI"></AttachViewer>
    <PopupSaleticketFilterUI v-if="platformticketFilterVisible" ref="popupSaleticketFilterUI" @completeHandler="handleSelection"></PopupSaleticketFilterUI>
    <div slot="footer" class="dialog-footer">
      <el-button @click="dialogVisible = false" size="medium">取 消</el-button>
      <el-button type="primary" size="medium" @click="handleSave">保存</el-button>
    </div>
  </el-dialog>
</template>

<script>
  import AttachViewer from '@/components/attachviewer.vue';
  import PopupSaleticketFilterUI from './PopupSaleticketFilter.vue';
  export default {
    components: {
      AttachViewer,
      PopupSaleticketFilterUI
    },
    data() {
      return {
        index: -1,
        detail: {
          ordercode: '',
          ouid: '',
          ptamount: 0,
          saleticket_status: '',
          saleticket_nums: [],
        },
        platformticketFilterVisible: false,
        ticketin_ids: [],
        dialogVisible: false,
        imageList: [],
        attachVisible: false,
      }
    },
    methods: {
      init(index, data) {
        this.index = index;
        this.detail = data;
      },
      format2Number(value, len) {
        var f = parseFloat(value);
        var f = Math.round(value * 10000) / 10000;
        var s = f.toString();
        var rs = s.indexOf('.');
        if (rs < 0) {
          rs = s.length;
          s += '.';
        }
        while (s.length <= rs + len) {
          s += '0';
        }
        return s;
      },
      handleSelection(index,list){

         for(var i=0;i<list.length;i++){
             if(this.detail.platformticket_ids.indexOf(list[i].fphm)==-1){
                this.detail.platformticket_ids.push(list[i].fphm);
             }
         }

      },
      handleAddTicket: function() {
        this.platformticketFilterVisible = true;
        this.$nextTick(() => {
          this.$refs.popupSaleticketFilterUI.dialogVisible = true;
          this.$refs.popupSaleticketFilterUI.init(this.index,this.detail.clientname,this.detail.account);
        })
        ;
      },
      handleSave: function() {
        const params={
          ouid:this.detail.ouid,
          status:this.detail.platformticket_status,
          fphms:this.detail.platformticket_ids
        }
        this.axios.post("api/admin/order/update_platformticket_bind", params).then(res => {
          if (res.status == 200 && res.data.code == 1) {
            this.$message.success({
              message: res.data.msg,
              duration: 1500,
              showClose: true
            });
            //this.upconfig.imglist = res.data.attachlist;
            this.$emit("closeHandler", this.index, res.data.status, this.ticketin_ids, res.data.attachlist);
            this.dialogVisible = false;
          } else {
            this.$message.error({
              message: res.data.msg,
              duration: 1500,
              showClose: true
            });
          }
        });
      },
      // 文件列表移除文件时的钩子
      handleRemove: function(index, data) {
        this.detail.platformticket_ids.splice(index, 1);
      },
      handlePreview(index, data) {
        this.attachVisible = true;
        this.$nextTick(() => {
          this.$refs.attachUI.dialogVisible = true;
          this.$refs.attachUI.initData(this.detail.saleticket_attaches);
        })
      }
    }
  }
</script>

<style scoped>

</style>
